<template>
  <div class="tagcloud_page">
      <Card :padding="0" shadow style="width: 300px;padding:0 0 20px  0">
            <p slot="title">
                <Icon type="md-pricetag" />
                标签云
            </p>
           <ul class="tag">
               <router-link v-for="(item,index) in list" :key="index"  :to="{path:'/search',query:{tag:item}}">
                <Tag :color="color[index]" :key="index">{{item}}</Tag>
               </router-link>
           </ul>
        </Card>
  </div>
</template>

<script>
export default {
    data(){
        return{
            page:0,
            limit:20,
            list:[],
            color:["default","primary","success","warning","error","magenta","red","volcano","orange","gold","yellow","lime","green","cyan","blue","geekblue","purple"],
            total:0,
        }
    },
    methods:{
        init(){
            this.$axios.get('/api/manage/tag/get').then(res =>{
                if(res.data.err_code == 1){
                    res.data.data = res.data.data.filter(item=> {
                        return item != '无'
                    });
                    this.list = res.data.data
                    this.total = res.data.data.length
                }else{
                    // console.error(res.data.message)
                }
            })
        }
    },
    mounted(){
        this.init()
    }
}
</script>

<style scoped>
    .tagcloud_page{
        margin-top: 20px
    }
    .tag{
        padding-left: 10px;
        padding-top: 6px;
    }
</style>>

</style>